<!DOCTYPE html>
<html lang='en'>

<head>
  <meta charset='UTF-8'>
  <meta http-equiv='X-UA-Compatible' content='IE=edge'>
  <meta name='viewport' content='width=device-width, initial-scale=1.0'>
  <title>Document</title>
  <script src='../vue.js'></script>
</head>

<body>
  <div id="app">

    <h1 name = "name">{{msg + 1}}</h1> 
    <h1 :name = "name">{{msg + 2}}</h1> 
    <h1 :name = "count+ 1">{{msg + 3}}</h1> 
    <h1 :src = "src">{{msg + 4}}</h1> 
    <h1 :src = " 'http://www.baidu.com/' + src">{{msg + 5}}</h1> 
    <h1 :hot = "isHot? 're' : 'leng' ">{{msg + 6}}</h1> 


  </div>

  <script>
    const vm = new Vue({
      data() {
        return {
          msg: "😢",
          name: "老六",
          count: 1,
          isHot: true,
          src: "01.jpg",
        }
      }
    })
    vm.$mount("#app")

  </script>
</body>

</html>